@import "./variables.sass"

// ----------------------------------------
// 输入框 Input
// 文本框 Textarea
// ----------------------------------------

.form-control
  width: 100%
  box-sizing: border-box
  margin-bottom: 10px
  padding: 6px 9px
  border: 1px solid $border
  border-radius: 4px
  box-shadow: none
  font-size: 12px
  background-color: white
  &:focus
    border-color: $brand
    outline: 0

input.form-control,
select.form-control
  height: 32px

input[type="radio"], 
input[type="checkbox"]
  margin-top: 3px

.form-horizontal
  label.control-label
    padding-top: 7px
    padding-right: 0
  label.radio-inline
    padding-top: 7px
    padding-right: 0
    margin: 0 15px 10px 0
    input[type=radio]
      margin-right: 10px

@media (max-width: 575px)
  .form-horizontal
    label.control-label
      text-align: left

@media (min-width: 576px)
  .form-horizontal
    label.control-label
      text-align: right

// ----------------------------------------
// 按钮 Button
// ----------------------------------------

.btn
  line-height: 1.5
  .rapfont
    line-height: 0.65rem
    margin-right: .5rem
a.btn.btn-success
  color: white

// .btn
//   font-size: 12px
//   line-height: 1.5
//   padding: 6px 20px
//   border: 1px solid $border
//   border-radius: 4px
//   background-color: $border
//   cursor: pointer
//   // height: 32px
//   &:hover
//     background-color: #ccc
//     border-color: $border
//   &:focus
//     outline: none
//     box-shadow: none
//   &.btn-primary
//     color: white
//     border-color: $brand
//     background-color: $brand
//     &:hover
//       background-color: $brand-hover
//   &.btn-rapfont
//     padding-right: 1.3rem
//     .rapfont
//       font-size: 0.65rem
//       margin-right: 0.325rem

// ----------------------------------------
// 表格 Table
// ----------------------------------------

table.table
  > thead
    > tr
      th
        overflow: hidden
        white-space: nowrap
        text-overflow: ellipsis
  > tbody
    > tr
      > td
        vertical-align: middle
        .operation
          visibility: hidden
    > tr:hover
      > td
        .operation
          visibility: visible

// ----------------------------------------
// 面板 Panel
// ----------------------------------------

// .panel
//   margin-bottom: 0.65rem
//   border: 1px solid $border
//   border-radius: 0.3rem
//   > .panel-header,
//   > .panel-footer
//     padding: 0.75rem 1.25rem
//     background-color: $bg
//   > .panel-header
//     border-bottom: 1px solid $border
//   > .panel-footer
//     border-top: 1px solid $border
//   > .panel-body
//     padding: 1.25rem

// ----------------------------------------
// 整站开屏动画
// ----------------------------------------

.OpeningScreenAdvertising
  position: absolute
  left: 50%
  top: 50%
  width: 20rem
  height: 2.6rem
  margin-left: -10rem
  margin-top: -2rem
  .Spin
    margin: 0
    padding: 0

// card
.card-block
  -webkit-box-flex: 1
  -ms-flex: 1 1 auto
  flex: 1 1 auto
  padding: 1.25rem

button:focus
  outline: none

.dropup, .dropright, .dropdown, .dropleft
  position: relative

.dropdown-toggle
  white-space: nowrap
  &::after
    display: inline-block
    margin-left: 0.255em
    vertical-align: 0.255em
    content: ""
    border-top: 0.3em solid
    border-right: 0.3em solid transparent
    border-bottom: 0
    border-left: 0.3em solid transparent
  &:empty::after
    margin-left: 0

.dropdown-menu
  position: absolute
  top: 100%
  left: 0
  z-index: 1000
  display: none
  float: left
  min-width: 10rem
  padding: 0.325rem 0
  margin: 0.125rem 0 0
  font-size: 1rem
  color: #212529
  text-align: left
  list-style: none
  background-color: #fff
  background-clip: padding-box
  border: 1px solid rgba(0, 0, 0, 0.15)
  border-radius: 0.25rem

.dropdown-menu-left
  right: auto
  left: 0

.dropdown-menu-right
  right: 0
  left: auto

@media (min-width: 576px)
  .dropdown-menu-sm-left
    right: auto
    left: 0
  .dropdown-menu-sm-right
    right: 0
    left: auto

@media (min-width: 768px)
  .dropdown-menu-md-left
    right: auto
    left: 0
  .dropdown-menu-md-right
    right: 0
    left: auto

@media (min-width: 992px)
  .dropdown-menu-lg-left
    right: auto
    left: 0
  .dropdown-menu-lg-right
    right: 0
    left: auto

@media (min-width: 1200px)
  .dropdown-menu-xl-left
    right: auto
    left: 0
  .dropdown-menu-xl-right
    right: 0
    left: auto

.dropup
  .dropdown-menu
    top: auto
    bottom: 100%
    margin-top: 0
    margin-bottom: 0.125rem
  .dropdown-toggle
    &::after
      display: inline-block
      margin-left: 0.255em
      vertical-align: 0.255em
      content: ""
      border-top: 0
      border-right: 0.3em solid transparent
      border-bottom: 0.3em solid
      border-left: 0.3em solid transparent
    &:empty::after
      margin-left: 0

.dropright
  .dropdown-menu
    top: 0
    right: auto
    left: 100%
    margin-top: 0
    margin-left: 0.125rem
  .dropdown-toggle
    &::after
      display: inline-block
      margin-left: 0.255em
      vertical-align: 0.255em
      content: ""
      border-top: 0.3em solid transparent
      border-right: 0
      border-bottom: 0.3em solid transparent
      border-left: 0.3em solid
    &:empty::after
      margin-left: 0
    &::after
      vertical-align: 0

.dropleft
  .dropdown-menu
    top: 0
    right: 100%
    left: auto
    margin-top: 0
    margin-right: 0.125rem
  .dropdown-toggle
    &::after
      display: inline-block
      margin-left: 0.255em
      vertical-align: 0.255em
      content: ""
      display: none
    &::before
      display: inline-block
      margin-right: 0.255em
      vertical-align: 0.255em
      content: ""
      border-top: 0.3em solid transparent
      border-right: 0.3em solid
      border-bottom: 0.3em solid transparent
    &:empty::after
      margin-left: 0
    &::before
      vertical-align: 0

.dropdown-menu
  &[x-placement^="top"], &[x-placement^="right"], &[x-placement^="bottom"], &[x-placement^="left"]
    right: auto
    bottom: auto

.dropdown-divider
  height: 0
  margin: 0.325rem 0
  overflow: hidden
  border-top: 1px solid #e9ecef

.dropdown-item
  display: block
  width: 100%
  padding: 0.25rem 1.5rem
  clear: both
  font-weight: 400
  color: #212529
  text-align: inherit
  white-space: nowrap
  background-color: transparent
  border: 0
  &:hover, &:focus
    color: #16181b
    text-decoration: none
    background-color: #f8f9fa
  &.active, &:active
    color: #fff
    text-decoration: none
    background-color: #007bff
  &.disabled, &:disabled
    color: #6c757d
    pointer-events: none
    background-color: transparent

.dropdown-menu.show
  display: block

.dropdown-header
  display: block
  padding: 0.325rem 1.5rem
  margin-bottom: 0
  font-size: 1rem
  color: #6c757d
  white-space: nowrap

.dropdown-item-text
  display: block
  padding: 0.25rem 1.5rem
  color: #212529